<template>
 <div class="blog-detail-container">
     <div class="aside">
         <h2>{{blog.title}}</h2>
       <span>日期：{{setDate(blog.createDate)}}</span>
       <span>浏览：{{blog.scanNumber}}</span>
       <a href="#data-from-container">评论：{{blog.commentNumber}}</a>
       <router-link :to="{
           name:'CategoryBlog',
           params:{
                categoryId:blog.category.id
           }
          
       }">{{blog.category.name}}</router-link>
     </div>
      <div v-html="blog.htmlContent" class="markdown-body"></div>
 </div>
</template>

<script>
import "highlight.js/styles/github.css";
import {setDate} from "../../../utils"
export default {
props:{
    blog:{
        type:Object,
        required:true,
    }
},
methods:{
    setDate,
}
}
</script>

<style lang="less" scoped>
@import "../../../style/markdown.css";
@import "../../../style/var.less";

.aside{
    span,a{
     margin-left: 10px;
     font-size: 12px;
     color: @gray;
      
    }
}
.markdown-body{
    margin-top:10px
}
</style>